@import "../../styles/base";

/*个人中心*/
.ga-user{
    .user-head{
      height:300rpx;
      padding-top:20rpx;
      background:$pink url("http://ga-1255639017.file.myqcloud.com/images/user/b_bg.png") bottom no-repeat;
      background-size: 100% auto;

      .head-box{
        @include wh(auto,190rpx);
        @extend %flex;
        padding:0 22rpx;

        .img-box{
          float:left;
          @include wh(103rpx,103rpx);
          @include border-radius(50%);
          border:3rpx solid #fff;
          @include flex(0 1 auto);
        }

        .con{
          float:left;
          color:#fff;
          padding:0 13rpx;
          @include flex(1 1 auto);
          .p1{
            @include wh(auto,20rpx,20rpx);
            font-size:30rpx;
            margin-top:41rpx;
          }

          .btn{
            border:none;
            display:block;
            @include wh(200rpx,60rpx,60rpx);
            text-align: center;
            font-size:20rpx;
            color:#fff;
            margin-left: 20rpx;
            @include gradient-directional(#ff6a03,#ff6a03);
            @include border-radius(25rpx);
          }
        }

        .ew{
          @include flex(0 1 auto);//不放大，不缩小

          img{
            @include wh(55rpx,56rpx);
          }
        }
      }

      .nav-box{
        @include wh(auto,110rpx);
        @extend %flex;
        @include justify-content(space-around);
        text-align: right;
        color:#fff;
        font-size:24rpx;
        @include bgcolor-alpha(rgba(#f6796f,.6));

        .item{
          padding:20rpx 10rpx;
        }

        .icon-angle-right{
          color:#ea3931;
          font-size:26rpx;
          margin-right:-17rpx;
        }
      }
    }

    .h1{
      background: #fff;
      padding:18rpx 22rpx;
    }

    .menu-box{
      @extend %flex;
      background: #fff;

      .item{
        padding:23rpx 0;
        text-align: center;
        @include flex(1 1 auto);

        @extend %active;

        p{
          margin-top:15rpx;
          font-size:20rpx;
        }
      }

      .icon{
        display:block;
        @include wh(100%,35rpx);
        background-repeat: no-repeat;
        background-position: center;
        background-size: auto 35rpx;

        &.icon1{
          background-image: url("http://ga-1255639017.file.myqcloud.com/images/icon/b_icon1.png");
        }
        &.icon2{
          background-image: url("http://ga-1255639017.file.myqcloud.com/images/icon/b_icon2.png");
        }
        &.icon3{
          background-image: url("http://ga-1255639017.file.myqcloud.com/images/icon/b_icon3.png");
        }
        &.icon4{
          background-image: url("http://ga-1255639017.file.myqcloud.com/images/icon/b_icon4.png");
        }
        &.icon5{
          background-image: url("http://ga-1255639017.file.myqcloud.com/images/icon/b_icon5.png");
        }
      }
    }
    .ga-arrow-cell{
        .button{
        
        }
    }
  }
